<template>
  <div class="risk">
    <van-search class="info_search" 
    v-model="value" 
       @search="onSearch"
      @clear="clearSearch"
      clearable
    placeholder="搜索" />
    <van-list
      style="margin-top: 10px"
      :finished="finished"
      v-model="loading"
      finished-text="没有更多了"
    >
      <van-radio-group @change="handleChange" v-model="result">
        <van-cell v-for="(item, index) in list" :key="index">
          <div class="risk_item_radio">
            <div>
              <div class="mb-10">{{ item.OrgName }}</div>
              <div>{{ item.OrgFullName }}</div>
            </div>
            <van-radio :name="item.OrgCode"></van-radio>
          </div>
        </van-cell>
      </van-radio-group>
    </van-list>
  </div>
</template>

<script>
import { getChooseTeamList } from "@/api/common";
export default {
    props: {
		OrgCode: {
			type: String,
			required: false,
		},
        SelectedValue: {
			type: String,
			required: false,
		},
    },
  data() {
    return {
      options: [],
      list: [],
      result:"",
      loading: false,
      finished: false,
      filter: {
        showMyDept: false
      },
      value: "",
    };
  },
  created() {
      this.result=this.SelectedValue;
    this.getList();
  },
  activated(){
      this.getList();
  },
  watch:{
      OrgCode:{
            handler(newName, oldName) {
      　　    this.getList();
    　　   }
      },
      SelectedValue:{
            handler(newName, oldName) {
      　　    this.result=newName;
    　　   }
      }
  },
  methods: {
    handleChange(id) {
        const newData = this.list.filter(item => item.OrgCode === id)
        var item= {
          value: newData[0].OrgCode,
          name:newData[0].OrgName
        };
        this.$emit('CallBack',item);
    },
    getList() {
      this.loading = true;
      this.filter.OrgCode=this.OrgCode;
      getChooseTeamList(this.filter)
        .then((res) => {
          this.loading = false;
          this.list = res.data;
          this.options = res.data;
          this.finished = true
          //this.filter.page = res.data.PageIndex;
        })
        .catch((err) => {
          this.finished = true;
        });
    },
    onSearch(keyWord) {
     if (keyWord) {
        this.list = this.fuzzyQuery(this.options, keyWord, "OrgName");
      }
      else
      {
      this.list = this.options;
      }
    },
    fuzzyQuery(list, keyWord, type) {
      var arr = [];
      list.map((item) => {
        if (item[type].indexOf(keyWord) >= 0) {
          arr.push(item);
        }
      });
      return arr;
    },
    clearSearch() {
      this.list = this.options;
    },
  },
};
</script>

<style lang="less" scoped>
.risk {
  height: 100vh;
  background-color: #e8f1f8;
  .info_search {
    padding: 10px;
    border-radius: 5px !important;
    .van-field__control {
      background-color: #ffffff !important;
    }
  }
}
.risk_item_radio {
  width: 100%;
  padding: 10px 20px;
  background-color: #fff;
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-bottom: 1px solid #e8f1f8;
}
</style>
